import React, { memo, forwardRef, useImperativeHandle } from "react";
interface ChildProps {
  sayHello: (name: string) => void;
  focus: (str: string) => void;
}

const ChildComponent = forwardRef<ChildProps>((props, ref) => {
  const focus = (str: string) => {
    console.log("Focused!" + str);
  };
  const sayHello = (name: string) => {
    console.log("hello" + name);
  };
  useImperativeHandle(ref, () => ({
    // 暴露给父组件的方法
    focus,
    sayHello,
  }));

  return <div>Click Parent to Focus</div>;
});
export default memo(ChildComponent);
